#{extends 'main.html' /}
#{set title:'Home' /}
<!-- port of https://github.com/facebook/php-sdk/blob/master/examples/example.php -->

<!--
   We use the JS SDK to provide a richer user experience. For more info,
   look here: http://github.com/facebook/connect-js
 -->
<div id="fb-root"></div>
<script type="text/javascript">
   window.fbAsyncInit = function() {
      FB.init({
         'appId' : ${appId},
         'session' : ${fbSession.raw()}, // don't refetch the session when we already have it
         'status' : true, // check login status
         'cookie' : true, // enable cookies to allow the server to access the session
         'xfbml' : true   // parse XFBML
      });

      // whenever the user logs in, we refresh the page
      FB.Event.subscribe('auth.login', function() {
         window.location.reload();
      });
   };

(function() {
  var e = document.createElement('script');
  e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
  e.async = true;
  document.getElementById('fb-root').appendChild(e);
}());
</script>

<h1>Example</h1>

#{if me != null}
<a href="${logoutUrl}">
<img src="http://static.ak.fbcdn.net/rsrc.php/z2Y31/hash/cxrz4k7j.gif">
</a>
#{/if}
#{else}
<div>
Using JavaScript &amp; XFBML: <fb:login-button></fb:login-button>
</div>
<div>
Without using JavaScript &amp; XFBML:
<a href="${loginUrl}">
  <img src="http://static.ak.fbcdn.net/rsrc.php/zB6N8/hash/4li2k73z.gif">
</a>
</div>
#{/else}

<h3>Session</h3>
#{if me != null}
<pre>${session}</pre>
<h3>You</h3>
<img src="https://graph.facebook.com/${uid}/picture">
${((com.google.gson.JsonObject)me).get("name").getAsString()};
<h3>Your User Object</h3>
<pre>${me}</pre>
#{/if}
#{else}
<strong><em>You are not Connected.</em></strong>
#{/else}

<h3>Naitik</h3>
<img src="https://graph.facebook.com/naitik/picture">
${((com.google.gson.JsonObject)naitik).get("name").getAsString()};
